<!--Display a success alert which can be dismissed later-->
<div role="alert" class="alert alert-success alert-dismissible">
    <button aria-label="Close" data-dismiss="alert" class="close" type="button"><span aria-hidden="true">×</span></button>
    Well done! You successfully read this important alert message.
</div>

<!--Display an information alert which can be dismissed later -->
<div role="alert" class="alert alert-info alert-dismissible">
    <button aria-label="Close" data-dismiss="alert" class="close" type="button"><span aria-hidden="true">×</span></button>
    Heads up! This alert needs your attention, but it's not super important.
</div>

<!--Display a warning alert which can be dismissed later -->
<div role="alert" class="alert alert-warning alert-dismissible">
    <button aria-label="Close" data-dismiss="alert" class="close" type="button"><span aria-hidden="true">×</span></button>
     Warning! Spyware detected on your system.
</div>

<!--Display a danger alert which can be dismissed later -->
<div role="alert" class="alert alert-danger alert-dismissible">
    <button aria-label="Close" data-dismiss="alert" class="close" type="button"><span aria-hidden="true">×</span></button>
    Oh snap! Change a few things up and try submitting again.
</div>